import React from 'react';

export default class Complex extends React.Component { //视图，react
  handleAdd = () => { //自定义事件处理方法，响应onClick事件
    this.props.dispatch({type:"complex/add"}); //发送指定事件。事件类型type，由命名空间complex和行为add组成。简单理解，对complex数据库实例进行add操作
  }

  handleMinus = () => {
    this.props.dispatch({type:"complex/minus"});
  }

  handleRandom = () => {
    this.props.dispatch({type:"complex/random_request"});
  }

  handleReset = () => {
    this.props.dispatch({type:"complex/reset_request"});
  }

  render() {
    return (
      <div className={"container"}>
        <h2>{ this.props.num }</h2>
        <button type="button" name="+" onClick={this.handleAdd}>+</button>
        <button type="button" name="-" onClick={this.handleMinus}>-</button>
        <button type="button" name="random" onClick={this.handleRandom}>random</button>
        <button type="button" name="reset" onClick={this.handleReset}>reset</button>
      </div>
    );
  }
}
